<template>
	<view class="container">
		<page-header></page-header>
		<view class="yyz" @click="viewYyz(info.yyz)">
			<iframe :src="info.yyz"></iframe>	
			<view class="yyz-mask"></view>
		</view>
		<view class="contact">
			<view class="contact-header">
				<view class="contact-title">联系方式</view>
			</view>
			
			<view class="contact-body">
				
				
				<view class="conatct-body-item"  @click="link(info.site)">
					<view class="contact-body-item-ico">
						<image src="/static/img/contact/ico-yyz.png"></image>
					</view>
					<view class="contact-body-item-title">企业官网</view>
					<view class="contact-body-item-content">{{info.site}}</view>
				</view>
				
				<view class="conatct-body-item" @click="link(info.office_account)">
					<view class="contact-body-item-ico">
						<image src="/static/img/contact/ico-gzh.png"></image>
					</view>
					<view class="contact-body-item-title">官方公众号</view>
					<view class="contact-body-item-content">道可云</view>
				</view>
				
				
				
				<a class="conatct-body-item"   :href='telphone'>
					<view class="contact-body-item-ico">
						<image src="/static/img/contact/ico-contact.png"></image>
					</view>
					<view class="contact-body-item-title">联系电话</view>
					<view class="contact-body-item-content">{{info.phone}}</view>
				</a>
				
				<view class="conatct-body-item">
					<view class="contact-body-item-ico">
						<image src="/static/img/contact/ico-locate.png"></image>
					</view>
					<view class="contact-body-item-title">办公地址</view>
					<view class="contact-body-item-content">{{info.address}}</view>
				</view>
				
			</view>
			
		</view>
	</view>
</template>

<script>
	import pageHeader from '@/components/header/header.vue'
	import api from '@/api/index.js'
	export default {
		components:{
			pageHeader
		},
		data() {
			return {
				src:"https://720.daokeyun.com/t/6bdfd46b0d11d7ca",
				info:{},
				telphone:'',
			}
		},
		onLoad(){
			this.getInfo();
			setTimeout(()=>{
				this.getShare();
			}, 500)
		},
		onShow(){
			console.log(window.location.href);
			//统计数据
			let interval = setInterval(()=>{
				 if(uni.getStorageSync('token')) {
					 clearInterval(interval);
					api.getRequest('stat', {
						top:'contact',
						sub:'',
						argv:''
					});
				 }
			}, 50)
		},
		methods: {
			getInfo(){
				const that = this;
				let uuid = "";
				if(uni.getStorageSync('uuid')) {
					uuid = uni.getStorageSync('uuid');
				}
				api.getRequest('contact', {uuid:uuid}).then((res)=>{
					let response = res.data;
					that.info = response
					that.telphone = 'tel:'+that.info.phone
				})
			},
			link(url) {
				window.location.href = url;
				return ;
				uni.navigateTo({
					url:'/pages/web/web?src='+encodeURIComponent(url)
				})
			},
			phone(pnum) {
				uni.makePhoneCall({
					phoneNumber:pnum
				})
			},
			viewYyz(url){
				window.location.href = url;
				return ;
				uni.navigateTo({
					url:'/pages/web/web?src='+encodeURIComponent(url)
				})
			},
			getShare(){
				 const that = this;	
				 let uuid = "";
				 if(this.$route.query.uuid) {
				 	uuid = this.$route.query.uuid;
				 	uni.setStorageSync('uuid', uuid)
				 }
				 else {
				 	uuid = uni.getStorageSync('uuid');
				 }
				 api.getRequest('shareData', {
				 	uuid:uuid,
					url:window.location.href
				 }).then((res)=>{
					 let response = res.data;
					 console.log('set setting', response);
					 
					 that.setShare(response.setting);
				 });
			},
			setShare(setting){
				let link = setting.shareLink;
				// if(uuid) link+='&uuid='+uuid;
				window.jWeixin.updateAppMessageShareData({ 
					title: setting.shareTitle, // 分享标题
					desc: setting.shareDesc, // 分享描述
					link: link, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
					imgUrl: setting.shareImg, // 分享图标
				});
				
				window.jWeixin.updateAppMessageShareData({
					title: setting.shareTitle, // 分享标题
					desc: setting.shareDesc, // 分享描述
					link: link, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
					imgUrl: setting.shareImg, // 分享图标
				});
				window.jWeixin.onMenuShareAppMessage({
					title: setting.shareTitle, // 分享标题
					desc: setting.shareDesc, // 分享描述
					link: link, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
					imgUrl: setting.shareImg, // 分享图标
				});
				window.jWeixin.onMenuShareTimeline({
					title: setting.shareTitle, // 分享标题
					desc: setting.shareDesc, // 分享描述
					link: link, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
					imgUrl: setting.shareImg, // 分享图标
				});
			}
		}
	}
</script>

<style scoped>
	.yyz{
		width: 100%;
		height: 358rpx;
		border: none;
		position: relative;
	}
	.yyz iframe{
		width: 100%;
		height: 100%;
	}
	.yyz .yyz-mask{
		position: absolute;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		background-color: rgba(0, 0, 0, 0);
	}
	
	.contact{
		margin-top: 35rpx;
	}
	.contact-header{
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.contact-header .contact-title{
		font-size: 36rpx;
		font-weight: bold;
		color: #fff;
		background-image:url('../../static/img/contact/ico-contact-bg.png');
		background-size: 100% 100%;
		background-repeat: no-repeat;
		/* width: 200rpx; */
		height: 50rpx;
		text-align: right;
		line-height: 50rpx;
		padding-right: 10rpx;
		padding-left: 50rpx;
	}
	
	.contact-body{
		margin: 25rpx;
	}
	
	.conatct-body-item{
		position: relative;
		width: 335rpx;
		height: 225rpx;
		box-sizing: border-box;
		border-radius: 8rpx;
		border: 1rpx solid #562e6c;
		margin-top: 70rpx;
		display: block;
		text-decoration: none;
	}
	
	.conatct-body-item:nth-child(odd){
		float: left;
	}
	
	.conatct-body-item:nth-child(even){
		float: right;
	}
	.contact-body-item-ico{
		position: absolute;
		left: 50%;
		top:0%;
		transform: translate(-50%, -50%);
		height: 100rpx;
		width: 100rpx;
		border-radius: 50%;
		background-color: #562e6c;
		border: 1rpx solid #661780;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.contact-body-item-ico image{
		height: 62rpx;
		width: 78rpx;
	}
	.contact-body-item-title{
		margin-top: 75rpx;
		width: 100%;
		text-align: center;
		color: #fd62ef;
		font-weight: bold;
		font-size: 28rpx;
	}
	.contact-body-item-content{
		margin: 25rpx;
		color: #fff;
		text-align: center;
		font-size: 20rpx;
		line-height: 1.5em;
		word-break: break-all;
	}
</style>

<style>
	@import '@/static/css/common.css';
	
</style>